<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
<head>

	<meta charset="utf-8">
	<title>WeatherSpark</title>
	<meta name="description" content="The One-Page Windows Phone 7 App Website Template">
	<meta name="author" content="Nick Harewood: www.space-scape.com/wp7appsite/">
	<!--[if lt IE 9]>
		<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
	<![endif]-->

	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

	<link rel="stylesheet" href="stylesheets/base.min.css">
	<link rel="stylesheet" href="stylesheets/skeleton.css">
	<link rel="stylesheet" href="stylesheets/layout.css">

	<style type="text/css">

	/* Text and Background colour */
	body {
		color: #000;
		background-color:#BDBDBD;
	}

	/* Header Colours */
	h1, h2, h3, h4, h5, h6 {color: #333;}
	#footer p {font-style:italic;}

	/* Link colour */
	a, a:visited { color: #666;}

	/* Logo */
	#header #logo h1 {
		width: 175px;
		height: 110px;
		background: transparent url(images/branding/logo.png) no-repeat;
	}

	/* Strapline colour */
	#header #strapline p {color: #000;}

	/* App Feature List - define custom feature icons here - */
	ul.featurelist li.BulletImage { background-image: url(images/lightning.png);background-position:left center;}

	/* User Review Quote */
	blockquote.user_quote p {color: #666;}

	</style>

	<link rel="shortcut icon" href="images/branding/favicon.ico">

</head>
<body>

	<div id="maincontainer" class="container">

		<div class="sixteen columns" id="header">

			<div id="logo" class="four columns alpha">
				<h1>WeatherSpark</h1>
			</div>

			<div id="strapline" class="six columns omega offset-by-six">
				<p><br/>Tired of text-based<br/>weather summaries?</p>
			</div>
		</div>
		<br class="clear"/>
		<div class="sixteen columns" id="contentcontainer">

			<div class="four columns alpha">
				<h5>Explore your local weather in detail!</h5>
				<p><br/>Sparkline-inspired graphs provide a comprehensive view of each day&rsquo;s temperature, humidity, precipitation, cloud cover, wind speed and direction.</p>
			</div>

			<div id="phonescreens" class="six columns">
				<div id="slider">
					<ul>
						<li><img src="images/screenshots/ss00.jpg" alt="Multiple Forecasts Screenshot" /></li>
						<li><img src="images/screenshots/ss01.jpg" alt="Manage Menu Screenshot" /></li>
						<li><img src="images/screenshots/ss02.jpg" alt="Graph Screenshot" /></li>
						<li><img src="images/screenshots/ss03.jpg" alt="Graph Menu Screenshot" /></li>
						<li><img src="images/screenshots/ss04.jpg" alt="Settings Screenshot" /></li>
						<li><img src="images/screenshots/ss05.jpg" alt="Tile Settings Screenshot" /></li>
						<li><img src="images/screenshots/ss06.jpg" alt="Choose Live Tile Screenshot" /></li>
						<li><img src="images/screenshots/ss07.jpg" alt="Summary Page Graph Settings Screenshot" /></li>
						<li><img src="images/screenshots/ss08.jpg" alt="Detail Page Graph Settings Screenshot" /></li>
						<li><img src="images/screenshots/ss09.jpg" alt="Choose Location Screenshot" /></li>
						<li><img src="images/screenshots/ss10.jpg" alt="Discover Location Screenshot" /></li>
						<li><img src="images/screenshots/ss11.jpg" alt="Zip Code Screenshot" /></li>
						<li><img src="images/screenshots/ss12.jpg" alt="City Name Screenshot" /></li>
					</ul>
				</div>
				<p class="downloadlink"><a href="https://www.microsoft.com/en-us/store/apps/weatherspark/9nblggh168k5">Download for Windows Phone</a></p>
			</div>

			<div id="features" class="six columns omega">
				<h2>Features</h2>
				<ul class="featurelist">
					<li class="BulletImage">Detailed hour-by-hour forecasts from <a href="http://www.weather.gov/">NOAA&rsquo;s National Weather Service</a> and <a href="http://www.yr.no/">YRNO&rsquo;s Norwegian Meteorological Institute</a></li>
					<li class="BulletImage">Day and hour-centered live tile sparklines</li>
					<li class="BulletImage">Find location with city name, zip, or GPS</li>
					<li class="BulletImage">Scrolling and day-by-day navigation</li>
					<li class="BulletImage">Previous day&rsquo;s history for comparison</li>
					<li class="BulletImage">Metric and imperial units</li>
				</ul>
				<p>
					<table border="0" align="center">
						<tr>
							<td style="background-color: #a2c139;"><img src="images/3027_-9774_M_D.png" alt="Metric Day Live Tile" width="100" height="100" /></td>
							<td width="25">&nbsp;</td>
							<td style="background-color: #a2c139;"><img src="images/3027_-9774_I_H.png" alt="Imperial Hour Live Tile" width="100" height="100" /></td>
						</tr>
					</table>
				</p>
				<!-- blockquote class="user_quote">
					<p>quote</p>
					<cite>user</cite>
				</blockquote -->
			</div>

		</div>

	</div>

<!--	# Footer #		-->
	<div class="container" id="footer">
		<p><a href="http://wp7appsite.codeplex.com/">WP App Site</a> by <a href="http://www.space-scape.com/">Nick Harewood</a></p>
	</div>

	<!-- Load all the JS -->
	<script type="text/javascript" src="javascripts/jsLoader.js"></script>

	<script type="text/javascript">
		$(document).ready(function(){
			$("#slider").easySlider({
				auto: true,
				continuous: true,
				pause: 5000,
				controlsShow: false
			});
		});
	</script>

</body>
</html>
